<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>账户登录</title>
		<link rel="stylesheet" type="text/css" href="css/login.css"/>
		<link rel="stylesheet" type="text/css" href="css/verify.css"/>
	</head>
	<body>
		<div class="oneplus">
			<!--头部-->
			<header class="web">
				<div class="header_box">
		             <div class="logo">
		             	<a href="http://www.oneplus.cn">
		             		<img src="img/logo.png"/>
		             	</a>
		             </div>
		             <div class="title">
		             	<div class="title_text">
		             		<ul>
		             			<li>
		             				<a href="http://www.oneplus.cn/5t" class="text">OnePlus 5T <i></i></a>
		             			</li>
		             			<li>
		             				<a href="http://store.oneplus.cn" class="text">商城 <i></i></a>
		             			</li>
								<li>
		             				<a href="http://service.oneplus.cn" class="text">服务 <i></i></a>
		             			</li>
								<li>
		             				<a href="http://pr.oneplus.cn" class="text">博客 <i></i></a>
			             		</li>
			             		<li>
		             				<a href="http://www.oneplusbbs.com" class="text">论坛 <i></i></a>
		             			</li>
		             		</ul>
		             	</div>
		             </div>
		             <div class="box_right">
		             	<div class="i_search">
		             		<a href="#">
		             			<span></span>
		             		</a>
		             	</div>
		             	<div class="i_cart">
		             		<a href="cart.html">
		             			<span></span>
		             		</a>
		             	</div>
		             	<div class="i_user">
		             		<a href="#">
		             			<span></span>
		             		</a>
		             	</div>
		             </div> 
	             </div>
			</header>
			<!--内容-->
			<div class="op-alone">
				<div class="auto-middle">
					<div class="login">
						<div class="login-box clearfix">
							<div class="login-left">
								<div class="login-head">登 录</div>
								<div class="input-box">
									<div class="input">
										<input type="text" id="loginname" placeholder="手机、邮箱或用户名" class="loginuser"/>
									</div>
								</div>
								<div class="input-box">
									<div class="input">
										<input type="password" id="password" placeholder="密码" class="loginuser"/>
									</div>
								</div>
								<!--验证码-->
								<div id="mpanel1" >
						        </div>
						        <div>
						        	<span></span>
						        	<div class="remeberme clear">
						        		<a href="http://account.oneplus.cn/login/forget">忘记密码?</a>
						        	</div>
						        </div>
						        <a href="javascript: void(0)" class="login-btn">
						        	<span>确 认</span>
						        </a>
						        <div class="login-no-user">
						        	<div class="login-no-box">
						        		<span>没有一加账户？</span>
						        		<a href="http://account.oneplus.cn/regist">立即注册</a>
						        	</div>
						        </div>
							</div>
							<div class="login-right">
								<div class="login-title">选择其他方式登录</div>
								<a href="http://account.oneplus.cn/qqlogin?state=1" class="qq" target="_parent">
									<span></span>
									QQ 快捷登录
								</a>
								<a href="http://account.oneplus.cn/wblogin?scope=1" class="wb" target="_parent">
									<span></span>
									微博快捷登录
								</a>
								<a href="http://account.oneplus.cn/wxlogin?state=1" class="wx" target="_parent">
									<span></span>
									微信快捷登录
								</a>
							</div>
						</div>
					</div>
				</div>
			</div>
			
			<!--尾部-->
			<footer>
				<div class="footer-link">
					<div class="footer-ul">
						<ul>
							<h2>一加产品</h2>
							<li><a href="http://www.oneplus.cn/5t">OnePlus 5T</a></li>
							<li><a href="http://www.oneplus.cn/product/oneplus5">OnePlus 5</a></li>
							<li><a href="http://www.oneplus.cn/product/oneplus3t">OnePlus 3T</a></li>
							<li><a href="http://www.oneplus.cn/product/oneplus3">OnePlus 3</a></li>
						</ul>
					</div>
					<div class="footer-ul">
						<ul>
							<h2>关于一加</h2>
							<li><a href="http://www.oneplus.cn/aboutus">了解一加</a></li>
							<li><a href="http://career.oneplus.cn">加入一加</a></li>
							<li><a href="http://www.h2os.com/">H2OS</a></li>
							
						</ul>
					</div>
					<div class="footer-ul">
						<ul>
							<h2>服务支持</h2>
							<li><a href="http://service.oneplus.cn/selfservice">自助服务</a></li>
							<li><a href="http://support.oneplus.cn/">技术支持</a></li>
							<li><a href="http://service.oneplus.cn/faq?categoryId=A1000029">售后服务</a></li>
							<li><a href="http://www.oneplus.cn/product/jiaduobao">一加加多保</a></li>
						</ul>
					</div>
					<div class="footer-kf">
						<h1>400-888-1111</h1>
						<a href="http://www.sobot.com/chat/pc/index.html?sysNum=8b1ffba807764bc3bf2da878e5bb3df6" target="_blank">在线客服</a>
						<div class="time">周一至周日 9:00 - 22:00</div>
					</div>
				</div>
				<div class="footer-bottom">
					<div class="bottom-text">
						<div class="flag">
							Change locations<a href=""><img src="img/flag.png"/></a>
						</div>
						<!--<div class="clear"></div>-->
						<div class="bottom-right">
							<span class="right-text">© 2013-2017  OnePlus. All Rights Reserved.  (粤ICP备13088308号-1)</span>
							<span class="cnnic">
								<a href="https://ss.knet.cn/verifyseal.dll?sn=e14063044030050707awmq000000&ct=df&a=1&pa=20151014">
									<img src="img/cnnic.png"/>
								</a>
							</span>
							<span class="record">
								<a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=44030402000178">
									<img src="img/record.png"/>粤公网安备 44030402000178号
								</a>
							</span>
						</div>
					</div>
				</div>
			</footer>
			<script src="js/jquery-1.11.0.js"></script>
			<script src="js/jquery.min.js"></script>
			<script type="text/javascript" src="js/verify.js"></script>
			<script>
				
        	$('#mpanel1').slideVerify({
        		type : 1,		//类型
        		vOffset : 5,	//误差量，根据需求自行调整
		        barSize : {
		        	width : '300px',
		        	height : '32px',
		        },
		        ready : function() {
		    	},
//		        success : function() {
//		        	alert('验证成功，添加你自己的代码！');
//		        	//......后续操作
//		        },
//		        error : function() {
//		        	alert('验证失败！');
//		        }
//		        
		    });
		    
		    
//		    $('#mpanel4').slideVerify({
//		    	type : 2,		//类型
//      		vOffset : 5,	//误差量，根据需求自行调整
//		        vSpace : 5,	//间隔
//		        imgName : ['1.jpg', '2.jpg'],
//		        imgSize : {
//		        	width: '400px',
//		        	height: '200px',
//		        },
//		        blockSize : {
//		        	width: '40px',
//		        	height: '40px',
//		        },
//		        barSize : {
//		        	width : '400px',
//		        	height : '40px',
//		        },
//		        ready : function() {
//		    	},
//		        success : function() {
//		        	alert('验证成功，添加你自己的代码！');
//		        	//......后续操作
//		        },
//		        error : function() {
////		        	alert('验证失败！');
//		        }
//		        
//		    });
			</script>
		</div>
	</body>
</html>
